import React from 'react';
import './index.less';
import {connect} from "dva";
import BaseComponent from "components/Base/BaseComponent";
import Editor from "components/Base/Editor";
import {Layout} from "antd";
import {putFile} from "utils/ossutils";
import Button from "components/Base/Button";
import Panel from "components/Base/Panel";

const {Content, Footer, Header} = Layout;

@connect(({goodEditor}) => ({goodEditor}))
export default class extends BaseComponent {

  state = {

  };

  getNamespace() {
    return 'goodEditor';
  }

  upload = async (files, insert) =>{
    const urls = await putFile(files, "good_description");
    insert(urls[0]);
  }

  save = () =>{

    const {onContent} = this.props;
    const {editor} = this.state;
    !!onContent && onContent(editor.getHtml());
    // console.log("html", editor.getHtml());
    // console.log("text", editor.getText());
  }

  rtun = () =>{
    this.props.rtun();
  }

  render() {

    const {content} = this.props;
    const html = "<p><br><img src=\"http://heruishop.oss-cn-hangzhou.aliyuncs.com/362503.png\" style=\"max-width:100%;\"><span id=\"transmark\" style=\"display: none; width: 0px; height: 0px;\"></span></p><p><br><br></p><p></p><p><br></p>";
    const editorProps = {
      value: content,
      customUploadImg : this.upload,
      onRef: (editor) =>{
        this.setState({editor: editor})
      }
    }

    return (
      <div className="editor">
        <div className={"controll"}>
          <Button  className={"btn"} type="primary" onClick={this.rtun}>返回</Button>
          <Button  className={"btn"} type="primary" onClick={this.save}>保存</Button>
        </div>
        <Panel title="商品详情编辑">
          <Editor {...editorProps}/>
        </Panel>
      </div>
    );
  }
}
